import React, { Component } from 'react'
import { SearchBar, WhiteSpace, NavBar, Icon } from 'antd-mobile';
import { List } from 'antd-mobile';
import { withRouter } from 'react-router-dom'
import store from '../redux/reduers';
import { connect } from 'react-redux'
import { updateHouseData } from '../redux/redux_actions'

let { BMapGL,BMAP_STATUS_SUCCESS} = window
const Item = List.Item;

class searchVillage extends Component {
    constructor(props) {
        super(props)
    
        this.state = {
            searchResult: [],
            regin: this.props.location.state.query.regin,
            local: ""
        }
    }
    change = this.debounce((e) => {

        if (!e) {
            return
        }
        console.log(e);
        this.state.local.search(e);
        console.log(this.state.local,'00000');
    })
    //节流函数
    debounce(func, wait = 500) {
        let timeout;  // 定时器变量
        return function (event) {
            clearTimeout(timeout);  // 每次触发时先清除上一次的定时器,然后重新计时
            event.persist && event.persist()   //保留对事件的引用
            //const event = e && {...e}   //深拷贝事件对象
            timeout = setTimeout(() => {
                func(event)
            }, wait);  // 指定 xx ms 后触发真正想进行的操作 handler
        };
    }
    componentWillMount() {
       
    }
    componentDidMount() {
        let rigin = this.state.regin.split(',')
        console.log(rigin, 50);
        let _that = this
        var options = {
            onSearchComplete: (results) => {
                console.log(results);
                // 判断状态是否正确
                if (this.state.local.getStatus() === BMAP_STATUS_SUCCESS) {
                    var s = [];
                    for (var i = 0; i < results.getCurrentNumPois(); i++) {
                        s.push(results.getPoi(i).title + ", " + results.getPoi(i).address);
                    }
                    _that.setState({
                        searchResult: s
                    })
                    console.log(s);
                }

            }
        };
        let local = new BMapGL.LocalSearch(rigin[0], options);
        this.setState({
            local: local
        })
    }
    render() {
        return (
            <div>
                <NavBar
                    mode="dark"
                    icon={<Icon type="left" />}
                    onLeftClick={() => this.props.history.go(-1)}
                >查询小区</NavBar>
                <WhiteSpace />
                <SearchBar placeholder="查询小区" onChange={this.change} />
                <WhiteSpace />

                {
                    this.state.searchResult.map((item, index) => {
                        return <Item key={index} arrow="horizontal" data-item={item} onClick={(e) => {
                            this.props.updateHouseData({ village: item})
                            this.props.history.push({ pathname: "/findNewHouse" })
                        }}>{item}</Item>
                    }) 
                }
            </div>
        )
    }
}
export default connect(state => state.houseData, { updateHouseData })(withRouter(searchVillage))
